﻿@{
    ViewBag.daitianbao = "active";
    ViewBag.Title = "待填报";
    Layout = "~/Views/Shared/_layout_jiudian.cshtml";
}


<div class="sousuo">
    <label>酒店</label>
    <select id="sel_jdid" class="sou_width">
        <option value="-1">全部</option>
        <option v-for="(item,index) in lisjd" :value="item.id">{{item.jd_name}}</option>
    </select>
    <label>类型</label>
    <select id="sel_bbtype" class="sou_width" onchange="change_dttype();">
        <option value="-1">全部</option>
        <option value="1">月报</option>
        <option value="2">年报</option>
    </select>
    <label>日期</label>
    <input id="inp_bbdate1" type="text" placeholder="请选择报表时间" class="sou_width">
    <label id="lb_bbdate">--</label>
    <input id="inp_bbdate2" type="text" placeholder="请选择报表时间" class="sou_width">
    <button class="sou_btn" onclick="GetBaoBiaoP(-2);"> 搜索</button>
</div>

<div class="tab_fill">
    <table class="tab_tb table table-striped table-hover">
        <tr>
            <td class="top_bt ">报表日期</td>
            <td class="top_bt ">报表名称</td>
            <td class="top_bt ">发布日期</td>
            <td class="top_bt ">截至日期</td>
            <td class="top_bt ">酒店名称</td>
            <td class="top_bt ">操作</td>
        </tr>
        <tr v-for="(item,index) in lisbb">
            <td>{{item.bb_riqi}}</td>
            <td>{{item.bb_name}}</td>
            <td>{{item.bb_fabu_dt}}</td>
            <td>{{item.bb_jieshu_dt}}</td>
            <td>{{item.jd_name}}</td>
            <td>
                <button class="btn btn-sm btn-primary" v-on:click="JDBaoBiaoTianBao(item.bbztid);">填报</button>
            </td>
        </tr>


    </table>    
</div>
<div style="text-align:center;margin-top:20px; margin-bottom:20px;" v-html="pageHtml"></div>
<div v-if="msg!=''" style="text-align:center;margin-top:20px; margin-bottom:20px; color:gray">{{msg}}</div>
<script>
    var vm = new Vue({
        el: '#app',
        data: {
            msg:"",
            pageHtml:"",
            lisjd:@(Html.Raw(ViewBag.lisjd)),
            lisbb:[],

        },
        methods: {
            JDBaoBiaoTianBao: function (bbztid) {
                to_url('/JiuDian/JDBaoBiaoTianBao?bbztid=' + bbztid, false);
            }
        }
    })

    function change_dttype() {
        $("#inp_bbdate1").remove();
        $("#inp_bbdate2").remove();
        $("#lb_bbdate").before('<input id="inp_bbdate1" type="text" placeholder="请选择报表时间" class="sou_width">');
        $("#lb_bbdate").after('<input id="inp_bbdate2" type="text" placeholder="请选择报表时间" class="sou_width">');
        var bbtype = $("#sel_bbtype option:selected").val();
        if (bbtype == -1) {
            laydate.render({
                elem: '#inp_bbdate1'
                , type: 'date'
            });
            laydate.render({
                elem: '#inp_bbdate2'
                , type: 'date'
            });
        }
        else if (bbtype == 1) {
            laydate.render({
                elem: '#inp_bbdate1'
                , type: 'month'
            });
            laydate.render({
                elem: '#inp_bbdate2'
                , type: 'month'
            });
        }
        else if (bbtype == 2) {
            laydate.render({
                elem: '#inp_bbdate1'
                , type: 'year'
            });
            laydate.render({
                elem: '#inp_bbdate2'
                , type: 'year'
            });
        }
    }

    function GetBaoBiaoP(jdid, bblx, bbdate1, bbdate2,zttb, pageIndex, pageSize) {
        if (jdid == -2) {
            jdid = $("#sel_jdid option:selected").val();
            bblx = $("#sel_bbtype option:selected").val();
            bbdate1 = $("#inp_bbdate1").val();
            bbdate2 = $("#inp_bbdate2").val();
            zttb = 0;
            pageIndex = 1;
            pageSize = 10;
        }
        var pa = { pageIndex: pageIndex, pageSize: pageSize, jdid: jdid, bblx: bblx, bbdate1: bbdate1, bbdate2: bbdate2, zttb: zttb };
        $.post("/JiuDian/GetBaoBiaoP",pa , function (res) {
            vm.pageHtml = res.pageHtml;
            vm.lisbb = res.lisbb;
            if (vm.lisbb.length <= 0) {
                vm.msg = "没有查询到任何数据！";
            }
            else {
                vm.msg = "";
            }
        });
    }

   

    $(function(){
        laydate.render({
            elem: '#inp_bbdate1'
            , type: 'date'
        });
        laydate.render({
            elem: '#inp_bbdate2'
            , type: 'date'
        });
        GetBaoBiaoP(-2);
    });
</script>


